<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <title>微学习</title>
    <div th:include="template::commonlink"></div>

    <link rel="stylesheet" type="text/css" href="/css/index.css"/>
    <link rel="stylesheet" type="text/css"
          href="/plugins/bootstrap4/css/bootstrap.min.css"/>


    <script>
        $("#article_ms_nav").addClass("active")
    </script>
</head>
<body>

<style>
    h1 {
        color: #29B4F0;
        text-decoration: none;
        font-size: 30px;
    }

    .node-header {
        font-size: 12px;
        color: #ccc;
    }
</style>


<div class="d-flex flex-row" style="background-color: #eeeeee">

    <div class="d-flex flex-column col-md-9 p-3">
        <div class="bg-light p-2 pt-3">
            <form action="${base}/articleManage/index" method="get" id="search">
                <div class="flex flex-row input-group">
                    <div class="form-inline" style="flex: 1;">
                        <label class="input-group-text">年级</label>
                        <select class="form-control" id="grade" name="grade_id" onchange="$('#search').submit()">
                            <option value="">全部</option>
                            <c:forEach items="${grades}" var="g">
                                <option value="${g.grade_id}" ${g.grade_id== page.grade_id?
                                'selected':''}>${g.grade_name}</option>
                            </c:forEach>
                        </select>
                    </div>

                    <div class="form-inline" style="flex: 1;">
                        <div class="input-group-prepend">
                            <span class="input-group-text">学科</span>
                        </div>
                        <select class="form-control" id="subject" name="subject_id" onchange="$('#search').submit()">
                            <option value="">全部</option>
                            <c:forEach items="${subjects}" var="s">
                                <option value="${s.subject_id}" ${s.subject_id== page.subject_id?
                                'selected':''}>${s.subject_name}</option>
                            </c:forEach>
                        </select>
                    </div>

                    <div class="form-inline" style="flex: 2;">
                        <label class="input-group-text">标题</label>
                        <input type="text" class="form-control" value="${page.title}"
                               name="title" id="title">
                    </div>
                    <div style="flex: 0.5;">
                        <button class="btn">查询</button>
                    </div>
                </div>
            </form>
        </div>

        <div id="article_content" class="bg-light p-2">
            <table class="table">
                <thead>
                <tr>
                    <th>序号</th>
                    <th>文章标题</th>
                    <th>文章大纲</th>
                    <th>点赞</th>
                    <th>阅读次数</th>
                    <th>发布时间</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>

                <tr th:each="a:${articles}">
                    <td><span th:text="${a.article_id}"></span></td>
                    <td>
                        <a href="${base}/article/detail?id=${a.article_id}" th:text="${a.article_title}"></a>
                    </td>
                    <td>${a.outline.o_name}</td>
                    <td><span class="icon">&#xe662;</span><span th:text="${a.article_zan}"></span></td>
                    <td><span class="icon">&#xe71b;</span><span th:text="${a.article_read_count}"></span></td>
                    <td><span th:text="${a.article_release_time}"></span></td>
                    <td>
                        <a href="${base}/articleManage/edit?id=${a.article_id}"><span class="icon">&#xefaa;</span></a>
                        <a class="ml-3" onclick="remove(${a.article_id})"><span class="icon">&#xe626;</span></a>
                    </td>
                </tr>
                </tbody>
            </table>
            <%@include file="/WEB-INF/views/page.jsp"%>
            <script>
                function remove(id) {
                    swal({
                        title: '确定?',
                        text: "确定要删除该文章吗!",
                        type: 'warning',
                        showCancelButton: true,
                        cancelButtonText: '取消',
                        confirmButtonColor: '#3085d6',
                        cancelButtonColor: '#d33',
                        confirmButtonText: '确定!'
                    }).then(function (rs) {
                        if (rs.value) {
                            $.ajax({
                                url: base + '/articleManage/remove',
                                type: 'post',
                                data: {id: id},
                                success: function (result) {
                                    if (result == 1) {
                                        swal({
                                            text: "删除成功!",
                                        })
                                    } else {
                                        swal({
                                            text: "删除失败!",
                                        })
                                    }
                                    // 刷新页面
                                    window.location.reload()
                                }
                            })
                        }
                    })

                }
            </script>

        </div>

    </div>
    <div th:include="template::navlink"></div>
</div>
<div></div>
<div th:include="template::footer"></div>
</body>
</html>